energy = [761.67,261,801.97,6737];
var regionsData,seriesData;

$.get('mockdata/childRegionData.json').done(
    function (data) {
        regionsData = data.regionsData;
        seriesData = data.series
    });

function setSolidGaugeChart(beginData,container) {
    var option = solidgaugeOption;
    option.series[0].data = [beginData];
    // option.series[0].point[0] = [beginData];
    SolidGaugeChart = Highcharts.chart(container,option);
}

function updateSolidGaugeChart() {
    //各时段耗电导入
    setSolidGaugeChart(energy[0],'solidgaugePeak');
    var peakTitle = {text:'峰时段用电'};
    SolidGaugeChart.setTitle(peakTitle);

    setSolidGaugeChart(energy[1],'solidgaugeFlat');
    var flatTitle = {text:'平时段用电'};
    SolidGaugeChart.setTitle(flatTitle);

    setSolidGaugeChart(energy[2],'solidgaugeValley');
    var valleyTitle = {text:'谷时段用电'};
    SolidGaugeChart.setTitle(valleyTitle);

    setSolidGaugeChart(energy[3],'solidgaugeCommon');
    var commonTitle = {text:'普通用电'};
    SolidGaugeChart.setTitle(commonTitle);
}

$(document).ready(function(){

    Highcharts.setOptions({
        lang: {
            printChart: '打印图表',
            downloadJPEG: '下载 JPEG 文件',
            downloadPDF: '下载 PDF   文件',
            downloadPNG: '下载 PNG  文件',
            downloadSVG: '下载 SVG  文件',
            downloadCSV: '下载 CSV  文件',
            downloadXLS: '下载 XLS   文件',
        },
        navigation: {
            menuItemStyle: {
                padding: '6px 14px'
            }
        }
    });
    //分时段耗电数据,定义模板
    solidgaugeOption = {
        chart: {
            type: 'solidgauge'
        },
        pane: {
            center: ['50%', '85%'],
            size: '140%',
            startAngle: -90,
            endAngle: 90,
            background: {
                backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || '#EEE',
                innerRadius: '60%',
                outerRadius: '100%',
                shape: 'arc'
            }
        },
        tooltip: {
            enabled: false
        },
        yAxis: {
            min: 0,
            max: 2000,
            stops: [
                [0.1, '#55BF3B'], // green
                [0.5, '#DDDF0D'], // yellow
                [0.9, '#DF5353'] // red
            ],
            lineWidth: 0,
            minorTickInterval: null,
            tickPixelInterval: 400,
            tickWidth: 0,
            title: {
                y: -70
            },
            labels: {
                y: 16
            }
        },
        plotOptions: {
            solidgauge: {
                dataLabels: {
                    y: 5,
                    borderWidth: 0,
                    useHTML: true
                }
            }
        },
        title: {
            text:'',
            margin:10,
            style:{
                fontSize:'14px'
            }
        },
        credits: {
            enabled: false
        },
        series: [{
            name: '',
            data: [],
            dataLabels: {
                format: '<div style="text-align:center"><span style="font-size:25px;color:' +
                ((Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black') + '">{y}</span><br/>' +
                '<span style="font-size:12px;color:silver">kWh</span></div>'
            },
            tooltip: {
                valueSuffix: ' kWh'
            }
        }]
    };
    updateSolidGaugeChart();

//实时监测
    $(function () {
       Highcharts.setOptions({
           global : {
               useUTC : false
           }
       });
        // Create the chart
        $('#realTimeView').highcharts('StockChart', {
            chart : {
                type:'area',
                events : {
                    load : function () {
                        // set up the updating of the chart each second
                        var series = this.series[0];
                        setInterval(function () {
                            var x = (new Date()).getTime(), // current time
                                y = Math.round(Math.random() * 100);
                            series.addPoint([x, y], true, true);
                        }, 1000);
                    }
                }
            },
            rangeSelector: {
                buttons: [{
                    count: 60,
                    type: 'minute',
                    text: '1h'
                }, {
                    count: 300,
                    type: 'minute',
                    text: '5h'
                }, {
                    type: 'all',
                    text: '1 Day'
                }],
                inputEnabled: false,
                selected: 0
            },
            title : {
                text : '耗电实时监测数据'
            },
            yAxis:{
                title: {
                    text: '耗电量 (kWh)'
                },
            },
            tooltip: {
                split: false,
                valueSuffix: ' kWh'
            },
            exporting: {
                enabled: false
            },
            series : [{
                name : '耗电量',
                data : (function () {
                    // generate an array of random data
                    var data = [], time = (new Date()).getTime(), i;
                    for (i = -86400; i <= 0; i += 1) {
                        data.push([
                            time + i * 1000,
                            Math.round(Math.random() * 100)
                        ]);
                    }
                    return data;
                }())
            }]
        });
    });
//子区域监测
    $(function () {
        // Create the chart
        $('#childRegionView').highcharts({
            chart: {
                type: 'column'
            },
            title: {
                text: '区域耗电概览'
            },
            tooltip: {
                valueSuffix: ' kWh'
            },
            xAxis: {
                type: 'Area'
            },
            yAxis:{
                title: {
                    text: '耗电量 (kWh)'
                },
            },
            legend: {
                enabled: false
            },
            plotOptions: {
                series: {
                    borderWidth: 0,
                    dataLabels: {
                        enabled: true
                    }
                }
            },
            series: [{
                name: '总耗电',
                colorByPoint: true,
                data: regionsData
            }],
            drilldown: {
                series: seriesData
            }
        });
    });
});

function search() {
    var area,building,floor,room;
    area = $("#area").val();
    building = $("#building").val();
    floor = $("#floor").val();
    room = $("#room").val();
    var postJson = {
        area: area,
        building: building,
        floor: floor,
        room: room
    };
    $.ajax({
        url: "",
        type: "get",
        dataType: "json",
        contentType: "application/json;charset=utf-8",
        data: postJson,
        success:function () {
            refresh();
        },
        error: function () {

        }
    });

}

function refresh() {
    updateSolidGaugeChart()
}


